<template>
  <Dialog :title="comInfo.name" :show="true" @close="cancel" :width="300" height="auto" :left="uiLeft" :top="60">
    <div class="box">
      <div class="item1">
        <div>是否编辑：</div>
        <div class="edit">
          <el-switch v-model="editingRef" size="small" />
          <el-button @click.stop="draw"> 重新绘制</el-button>
        </div>
      </div>
      <div class="item1">
        <div class="key">棱柱尺寸:</div>
        <el-input type="number" v-model="columnSize" placeholder="请输入尺寸" />
      </div>
      <div class="item1">
        <div class="key">棱柱高度:</div>
        <el-input type="number" v-model="columnHeight" placeholder="请输入高度" />
      </div>
      <div class="item1">
        <div class="key">拦截网长度:</div>
        <el-input type="number" v-model="brandLength" placeholder="请输入长度" />
      </div>
      <div class="item1">
        <div class="key">拦截网高度:</div>
        <el-input type="number" v-model="brandHeight" placeholder="请输入高度" />
      </div>
      <div class="item1">
        <div class="key">拦截网宽度:</div>
        <el-input type="number" v-model="brandWidth" placeholder="请输入宽度" />
      </div>
      <div class="item1">
        <div class="key">编辑模式:</div>
        <el-select v-model="analysisModeValue" placeholder="请选择">
          <el-option v-for="item in analysisMode" :key="item.value" :label="item.label" :value="item.value" />
        </el-select>
      </div>
      <div class="btn1">
        <el-button @click="submit"
          :disabled="!eSOverheadLinesClippingUFMS || eSOverheadLinesClippingUFMS.positionEditing">创建</el-button>
      </div>
    </div>
  </Dialog>
</template>
<script setup lang="ts">
import {
  createVueDisposer,
  toVR,
} from "vue-xe2-plugin/dist-node/components/xe2/tools";
import Dialog from "../../components/Dialog.vue";
import { onBeforeUnmount, ref, onMounted, computed, watch } from "vue";
import { getProjectManager } from "../../scripts/getProjectManager";
import TooltipCom from "@/components/common/TooltipCom.vue";
import { ESOverheadLinesClippingUFMS } from "@/scripts/esobjs/ESOverheadLinesClippingUFMS";
import { getsceneObjNumfromSceneTree } from "@/scripts/utils";

const props = withDefaults(defineProps<{ comInfo: any }>(), {});
const uiLeft = ref(document.body.clientWidth - 10 - 300);
const brandHeight = ref(6);
const brandLength = ref(2);
const brandWidth = ref(2);
const columnSize = ref(1);
const columnHeight = ref(3);

const emits = defineEmits(["cancel"]);
const cancel = () => {
  emits("cancel", props.comInfo.id);
};

const d = createVueDisposer(onBeforeUnmount);

const objm = getProjectManager();
const modelser2SceneTreeWrapper = objm.modelser2SceneTreeWrapper;

const modelserManager = getProjectManager().modelserManager;

const editPolygon = modelserManager.editPolygon;

let eSOverheadLinesClippingUFMS: any = ref();
let editingRef = ref(false);

const analysisModeValue = ref("1");

// 裁剪方式
const analysisMode = [
    {
        value: "1",
        label: "裁剪",
    },
    {
        value: "2",
        label: "压平",
    },
];

watch(editingRef, (val) => {
  if (!eSOverheadLinesClippingUFMS.value) return;
  eSOverheadLinesClippingUFMS.value.positionEditing = val
})
watch(eSOverheadLinesClippingUFMS, (newVal) => {
  if (!eSOverheadLinesClippingUFMS.value) return;
  eSOverheadLinesClippingUFMS.value.dispose(eSOverheadLinesClippingUFMS.value.positionEditingChanged.disposableOn((val: any) => {
    editingRef.value = val
  }))
})

const create = () => {
  eSOverheadLinesClippingUFMS.value && objm.destroySceneObject(eSOverheadLinesClippingUFMS.value);
  eSOverheadLinesClippingUFMS.value = d.ad(objm.createSceneObject(ESOverheadLinesClippingUFMS) as ESOverheadLinesClippingUFMS);
  d.dispose(() => {
    eSOverheadLinesClippingUFMS.value &&
      objm.destroySceneObject(eSOverheadLinesClippingUFMS.value);
  });
  editingRef.value = true;

  eSOverheadLinesClippingUFMS.value.fillColor = [1, 0, 0, 0.5];
  eSOverheadLinesClippingUFMS.value.brandHeight = Number(brandHeight.value);
  eSOverheadLinesClippingUFMS.value.brandLength = Number(brandLength.value);
  eSOverheadLinesClippingUFMS.value.brandWidth = Number(brandWidth.value);
  eSOverheadLinesClippingUFMS.value.columnHeight = Number(columnHeight.value);
  eSOverheadLinesClippingUFMS.value.columnSize = Number(columnSize.value);
  // updateParam();
};
const updateParam = () => {
  eSOverheadLinesClippingUFMS.value.brandHeight = Number(brandHeight.value);
  eSOverheadLinesClippingUFMS.value.brandLength = Number(brandLength.value);
  eSOverheadLinesClippingUFMS.value.brandWidth = Number(brandWidth.value);
  eSOverheadLinesClippingUFMS.value.columnHeight = Number(columnHeight.value);
  eSOverheadLinesClippingUFMS.value.columnSize = Number(columnSize.value);
  eSOverheadLinesClippingUFMS.value.start.operation = analysisModeValue.value as "1" | "2";
  eSOverheadLinesClippingUFMS.value.end.operation = analysisModeValue.value as "1" | "2";
  eSOverheadLinesClippingUFMS.value.brand.operation = analysisModeValue.value as "1" | "2";
};
// 监听顶面高度模式和变化
watch([brandHeight, brandLength, brandWidth, columnSize, columnHeight,analysisModeValue], () => {
  updateParam();
});

// 重新绘制
const draw = () => {
  if (eSOverheadLinesClippingUFMS.value.positionEditing) {
    eSOverheadLinesClippingUFMS.value.positionEditing = false;
  }
  eSOverheadLinesClippingUFMS.value.points = [];
  eSOverheadLinesClippingUFMS.value.positionEditing = true;
};




// 提交 确定按钮
const submit = async () => {
  // 1.创建一个文件夹
  const group = modelser2SceneTreeWrapper?.createGroupTreeItem() as any
  const json = modelser2SceneTreeWrapper?.json.root.children as any
  let num = objm.setGroupName(json, "拦截网绘制")
  group.name = `接触网裁剪${num}`

  // 2.创建场景对象
  const treeItemStart = objm.createdTreeItemInnerGroup(modelser2SceneTreeWrapper, group)
  treeItemStart.sceneObject = objm.createSceneObjectFromJson(eSOverheadLinesClippingUFMS.value.start.json);
  // @ts-ignore
  treeItemStart.sceneObject.absoluteBottom = false;
  // @ts-ignore
  treeItemStart.sceneObject.operation = analysisModeValue.value
  treeItemStart.name =
    "柱状裁剪" + `(${getsceneObjNumfromSceneTree("ESGeoExtrudedPolygonUFMSFromCircle", modelser2SceneTreeWrapper)})`;

  const treeItemEnd = objm.createdTreeItemInnerGroup(modelser2SceneTreeWrapper, group)
  treeItemEnd.sceneObject = objm.createSceneObjectFromJson(eSOverheadLinesClippingUFMS.value.end.json);
  // @ts-ignore
  treeItemEnd.sceneObject.absoluteBottom = false;
  // @ts-ignore
  treeItemEnd.sceneObject.operation = analysisModeValue.value
  treeItemEnd.name =
    "柱状裁剪" + `(${getsceneObjNumfromSceneTree("ESGeoExtrudedPolygonUFMSFromCircle", modelser2SceneTreeWrapper)})`;

  const treeItemBrand = objm.createdTreeItemInnerGroup(modelser2SceneTreeWrapper, group)
  treeItemBrand.sceneObject = objm.createSceneObjectFromJson(eSOverheadLinesClippingUFMS.value.brand.json);
  // @ts-ignore
  treeItemBrand.sceneObject.absoluteBottom = true;
  // @ts-ignore
  treeItemBrand.sceneObject.operation = analysisModeValue.value
  treeItemBrand.name =
    "自由绘制" + `(${getsceneObjNumfromSceneTree("ESGeoExtrudedPolygonUFMS", modelser2SceneTreeWrapper)})`;

  // @ts-ignore
  treeItemStart.sceneObject.fillColor = treeItemEnd.sceneObject.fillColor = treeItemBrand.sceneObject.fillColor = [0, 0, 1, 0.5];
  create();
};

onMounted(() => {
  create();
});
</script>

<style scoped>
.box {
  box-sizing: border-box;
  width: 100%;
  height: 100%;
  padding: 15px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.item1 {
  display: grid;
  grid-template-columns: 95px 1fr;
  align-items: center;
  margin-bottom: 8px;
}


.btn1 {
  display: flex;
  justify-content: flex-end
    /* justify-content: space-between; */
}

.el-button {
  margin-left: 0px !important;
}

.edit {
  display: flex;
  gap: 20px;
  align-items: center;
}
</style>